/* 自定义 Toast 外框 */
.custom-toast {
  background: rgba(20, 20, 20, 0.95) !important;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  padding: 12px 16px !important;
  max-width: 320px;
  min-width: 200px;
  width: fit-content;
  display: flex !important;
  align-items: center;
  word-break: break-word;
  justify-content: center;
  backdrop-filter: blur(10px); /* 添加毛玻璃效果 */
  border: 1px solid rgba(255, 255, 255, 0.1); /* 添加边框 */
}

.custom-toast .v-toast__text {
  margin: 0;
  padding: 0;
  text-align: center;
  color: white !important;
}

.custom-toast .vn__icon {
  color: #00FF7F !important;     /* √ 为绿色 */
  font-size: 20px;
  margin-right: 8px;
}

/* 错误状态的 Toast */
.custom-toast.v-toast__item--error {
  border-left: 4px solid #FF4757;
}

.custom-toast.v-toast__item--error .v-toast__text::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FF4757' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z'/%3E%3C/svg%3E");
  background-size: cover;
  background-repeat: no-repeat;
  filter: drop-shadow(0 0 4px rgba(255, 71, 87, 0.8));
  flex-shrink: 0;
}

/* 警告状态的 Toast */
.custom-toast.v-toast__item--warning {
  border-left: 4px solid #FFA502;
}

.custom-toast.v-toast__item--warning .v-toast__text::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FFA502' d='M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z'/%3E%3C/svg%3E");
  background-size: cover;
  background-repeat: no-repeat;
  filter: drop-shadow(0 0 4px rgba(255, 165, 2, 0.8));
  flex-shrink: 0;
}

/* 入场动画 */
@keyframes slide-in {
  0% { 
    transform: translateY(-20px); 
    opacity: 0;
    scale: 0.95;
  }
  100% { 
    transform: translateY(0); 
    opacity: 1;
    scale: 1;
  }
}

/* 退场动画 */
@keyframes slide-out {
  0% { 
    transform: translateY(0); 
    opacity: 1;
    scale: 1;
  }
  100% { 
    transform: translateY(-20px); 
    opacity: 0;
    scale: 0.95;
  }
}

.v-toast__item {
  animation: slide-in 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.v-toast__item.v-toast__item--removing {
  animation: slide-out 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 响应式设计 */
@media (max-width: 480px) {
  .custom-toast {
    max-width: calc(100vw - 32px);
    min-width: 280px;
    margin: 0 16px;
  }
  
  .custom-toast .v-toast__text {
    font-size: 14px;
  }
  
  .custom-toast.v-toast__item--success .v-toast__text::before,
  .custom-toast.v-toast__item--error .v-toast__text::before,
  .custom-toast.v-toast__item--warning .v-toast__text::before {
    width: 18px;
    height: 18px;
    margin-right: 8px;
  }
}

/* Hover 效果 */
.custom-toast:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.4);
  transition: all 0.2s ease;
}

/* 确保容器样式 */
.v-toast__container {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
}

.v-toast__container .v-toast__item {
  pointer-events: auto;
}